<template>
    <div class="mainDiv">
        <div class="rowHead">
            <el-input style="width: 200px" placeholder="搜索商品名称" @keyup.enter.native="searchList" v-model="page.search">
                <i slot="suffix" class="el-icon-search" style="line-height: 40px;width: 25px;cursor: pointer;" @click="searchList"></i>
            </el-input>
        </div>
        <el-table :data="tableNum" :stripe="true" height="100%">
            <el-table-column fixed prop="name" label="商品名称" width="200"> </el-table-column>
            <el-table-column fixed prop="nums" label="总部数量" width="100"> </el-table-column>
            <el-table-column :label="table.name" v-for="table in tableData" class="width" :key="table.id">
                <template scope="scope">
                    {{scope.row[table.name + '_' + table.id]}}
                </template>
            </el-table-column>
            <el-table-column prop="allnums" fixed="right" label="总计" width="100"></el-table-column>
        </el-table>
        <el-pagination @size-change="sizeChange" @current-change="currentChange" :page-sizes="[15, 30, 50, 100]" :page-size="page.limits" layout="total, sizes, prev, pager, next, jumper" :total="total">
        </el-pagination>
    </div>
</template>
<script>
import C from '#/src/common/common.js'
export default {
    name: 'stockGoodslist',
    data() {
        return {
            tableData: [],
            tableNum: [],
            page: {
                pages: 1,
                limits: 15,
                search: '',
            },
            total: 0
        }
    },
    mounted() {
        this.getList()
    },
    methods: {
        refresh: function() {
            window.location.reload()
        },
        getList: async function() {
            let data = await C.ajax('/organization/stock/stockgoodslist', this.page, 'post')
            if (data) {
                this.total = data.count
                this.tableData = data.shoplist
                this.tableNum = data.data
            }
        },
        searchList: function() {
            this.getList()
        },
        sizeChange: function(val) {
            this.page.limits = val
            this.getList()
        },
        currentChange: function(val) {
            this.page.pages = val
            this.getList()
        },
    }
}
</script>